<div class="fixed-top h-100 w-100 login-pad bg-white">
    <div class="w-100 h-100 bg-{{global.getValue('color')}} d-flex justify-content-center flex-wrap">
        <div style="min-width:25rem" class="background flex-grow-1 window"
            [ngStyle]="{'background-image':config.BACKGROUND_IMAGE_SRC}">
        </div>
        <form style="width:25rem" class="card h-100 rounded-0 border-0" autocomplete="off">
            <div class="card-header login-header text-center border-bottom">
                <img [src]="config.LOGO" width="35">
                <span class="ml-2">{{config.TITLE}}</span>
                <!-- <span class="pull-right text-muted">版本 2.0.0</span> -->
            </div>
            <div class="card-body">
                <div class="mb-4">
                    <h5 class="text-muted">{{config.SUBJECT}}</h5>
                    <small class="text-muted">{{config.DESCRIPTION}}</small>
                </div>
                <div class="form-group">
                    <label class="text-muted">{{config.FIRST_LABEL}}</label>
                    <div class="input-group">
                        <div class="input-group-prepend">
                            <span class="input-group-text bg-white rounded-0">
                                <i class="iconfont icon-account" aria-hidden="true"></i>
                            </span>
                        </div>
                        <input type="text" name="account" [(ngModel)]="account.account" class="form-control rounded-0"
                            [placeholder]="config.FIRST_PLACEHOLDER">
                    </div>
                </div>
                <div class="form-group">
                    <label class="text-muted">{{config.SECOND_LABEL}}</label>
                    <div class="input-group">
                        <div class="input-group-prepend">
                            <span class="input-group-text bg-white rounded-0">
                                <i class="iconfont icon-lock" aria-hidden="true"></i>
                            </span>
                        </div>
                        <input (keyup.enter)="btn.present();confirmLogin(btn)" type="password" name="password"
                            [(ngModel)]="account.password" class="form-control
                    rounded-0" [placeholder]="config.SECOND_PLACEHOLDER">
                    </div>
                </div>
                <div class="form-group ">
                    <!-- <span class="pull-right text-muted ">忘记密码？</span> -->
                    <span class="pull-right text-muted">预览：账号 admin 密码 123456789</span>
                </div>
                <div class="p-4"></div>
                <div class="d-flex justify-content-around">
                    <button #btn="tsBtn" tsBtn lg loading [color]="global.params.color" class="flex-grow-1 rounded-0"
                        (submit)="confirmLogin($event)">登录</button>
                    <button #btn="tsBtn" tsBtn="success" lg class="flex-grow-1 rounded-0 ml-3"
                        (click)="devPreview()">开发者预览</button>
                </div>

            </div>
            <div class="card-footer bg-white text-center">
                <p class="mt-1 mb-0">Copyright © 2019 XiaoJian. All Rights Reserved.
                    <br> 赣 ICP备16010587号</p>
            </div>
        </form>
    </div>
</div>